<!DOCTYPE html>
<!-- saved from url=(0073)http://www.17sucai.com/preview/1554928/2019-01-07/201507211841/index.html -->
<html lang="zh" class=" -webkit-"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>带科幻风格的纯CSS3用户登录界面设计</title>
	
	<link rel="stylesheet" type="text/css" href="./normalize.css">
	<link rel="stylesheet" type="text/css" href="./default.css">
	<script src="./prefixfree.min.js.下载"></script>
	<link rel="stylesheet" type="text/css" href="./styles.css">
</head>
<body>
<div id="logo"> 
  <h1 class="hogo"><i> STARK INDUSTRIES</i></h1>
</div> 
<section class="stark-login">
  <form action="http://www.17sucai.com/preview/1554928/2019-01-07/201507211841/index.html" method="">	
    <div id="fade-box">
      <input type="text" name="username" id="用户名" placeholder="用户名" required="">
        <input type="password" placeholder="密码" required="">
          
          <button>登录</button> 
        </div>
      </form>
      <div class="hexagons">
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <span>⬢</span>
        <br>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <span>⬢</span>
          <br>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span> 
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            <span>⬢</span>
            
            <br>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <span>⬢</span>
              <br>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
                <span>⬢</span>
              </div>      
        </section> 
    
        <div id="circle1">
          <div id="inner-cirlce1">
            <h2> </h2>
          </div>
        </div>
    <ul>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
    </ul>
	

</body></html>